<template>
  <div class="body-box">
    <window-title title="条件筛选"></window-title>
    <el-form size="mini" :inline="true" style="margin-top:20px;">
      <el-form-item label="时间">
        <el-date-picker
          v-model="times"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          format="yyyy 年 MM 月 dd 日"
          value-format="yyyy-MM-dd"
          end-placeholder="结束日期"
        ></el-date-picker>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-search" class="com-btn" @click="search()">查询</el-button>
      </el-form-item>
    </el-form>
    <window-title title="提现列表"></window-title>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane name="0">
        <span slot="label">全部</span>
      </el-tab-pane>
      <el-tab-pane name="1">
        <span slot="label">待审核 <span class="tab-badge">{{verify_num}}</span></span>
      </el-tab-pane>
      <el-tab-pane name="2">
        <span slot="label">已同意</span>
      </el-tab-pane>
      <el-tab-pane name="3">
        <span slot="label">已拒绝</span>
      </el-tab-pane>
    </el-tabs>
    <!-- 表格 -->
    <el-table :data="list.data" size="mini" border v-loading="table_load">
      <el-table-column type="index" fixed="left"></el-table-column>
      <el-table-column label="提现人" prop="bank_info.user_name"></el-table-column>
      <el-table-column label="提现金额" prop="price" width="80px"></el-table-column>
      <el-table-column label="提现银行" prop="bank_info.bank" width="120px"></el-table-column>
      <el-table-column label="银行卡号" prop="bank_info.no"  min-width="150px"></el-table-column>
      <el-table-column label="手机号码" prop="bank_info.mobile" width="120px"></el-table-column>
      <el-table-column label="状态" width="80">
        <template slot-scope="item">
          <el-tag size="mini" v-if="item.row.state == 1">审核中</el-tag>
          <el-tag size="mini" v-if="item.row.state == 2" type="success">已同意</el-tag>
          <el-tag size="mini" v-if="item.row.state == 3" type="danger">已拒绝</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="提现时间" prop="create_time" width="140px"></el-table-column>
      <el-table-column label="审核时间" width="140px">
        <template slot-scope="item">
          {{item.row.state == 0 ? '--' : item.row.update_time}}
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import windowTitle from "../../components/unit/title.vue";

export default {
  components: { windowTitle },
  data() {
    return {
      times: "",
      list: {
        current_page: 1,
        data: [],
      },
      activeName: "0",
      table_load : true,
      verify_num : 0,
    };
  },
  mounted(){
    this.getData();
  },
  methods:{
    //切换TAB
    handleClick(){
      this.list.current_page = 1;
      this.getData();
    },
    //获取提现列表
    getData(){
      this.table_load = true
      this.ajaxs('finance/cashList',{
        data : {page : this.list.current_page ,state : this.activeName , times : this.times},
        success:(res) => {
          this.list = res.msg.list;
          this.verify_num = res.msg.num;
          this.table_load = false;
        }
      });
    },
    //查询
    search(){
      this.list.current_page = 1;
      this.getData();
    },
  }
};
</script>

<style>
</style>